<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
		<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=dAVCgTnW50hRWsp1bXRfPLPIMLF1nR3b"></script>
		<script type="text/javascript" src="http://api.map.baidu.com/library/DrawingManager/1.4/src/DrawingManager_min.js"></script>
		<link rel="stylesheet" href="http://api.map.baidu.com/library/DrawingManager/1.4/src/DrawingManager_min.css" />
		<script type="text/javascript" src="js/GeoUtils.js"></script>
		<title>验证坐标是否在区域内</title>
		<!-- 样式 -->
		<style>
			html {
				height: 100%
			}

			body {
				height: 100%;
				margin: 0px;
				padding: 0px
			}

			#container {
				height: 100%
			}
			.controlCss{
				width:800px;
				height:30px;
				line-height: 30px;
				font-size:20px;
				background:yellow;
			}
		</style>
		<!-- js -->
		<script type=" text/javascript">
			//变量
			var map; //地图
			var clickCentPoint = new BMap.Point(117.097377, 36.872594); //拾取中心坐标点
			var polygonData; //记录多边形已获取区域
			var labelUp;
			//初始化方法页面初始化时加载
			window.onload = function() {
				///初始化地图
				initMap();
				Addpolygon();
				addMarker();

			}
			//初始化地图
			function initMap() {
				map = new BMap.Map("container");
				//map.centerAndZoom('济南', 11); //设置中心点
				map.centerAndZoom(new BMap.Point(116.98, 36.67), 11); //设置中心点
				map.enableScrollWheelZoom(true); //启用鼠标缩放

			}
			//增加多边形
			function Addpolygon() {
				var polygon = new BMap.Polygon([
					new BMap.Point(117.087377, 36.732494),
					new BMap.Point(117.185687, 36.912185),
					new BMap.Point(117.087377, 36.932594),
				], {
					strokeColor: "blue",
					strokeWeight: 2,
					strokeOpacity: 0.1, //边线透明度
					fillOpacity: 0.5 //填充的透明度
				}); //创建多边形
				map.addOverlay(polygon); //增加多边形
				//开启多边形编辑
				polygon.enableEditing();
				//记录多边形
				polygonData = polygon;
				
			}
			//创建标注点并添加到地图中
			function addMarker(points) {
				var point = new BMap.Point(117.097377, 36.872594);
				var marker = new BMap.Marker(point); //将点转化成标注点
				map.addOverlay(marker); //将标注点添加到地图上
				//添加监听事件
				(function() {
					var thePoint = point;
					marker.addEventListener("click",
						function() {
							showInfo(this, thePoint);
						});
				})();
			}

			//判断点是否在区域内
			function showInfo(thisMarker, point) {
				//判断点是否在
				if (BMapLib.GeoUtils.isPointInPolygon(point, polygonData)) {
					var infoWindow = new BMap.InfoWindow("在区域内");
					thisMarker.openInfoWindow(infoWindow); //图片加载完后重绘infoWindow
				} else {
					var infoWindow = new BMap.InfoWindow("不在区域内");
					thisMarker.openInfoWindow(infoWindow); //图片加载完后重绘infoWindow
				}

			}
		</script>
	</head>
	<body>
		<div id="container"></div>

	</body>
</html>
